<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib uri='http://www.springframework.org/security/tags' prefix='sec'%>
<!DOCTYPE html>
<html>
	<head>
		<jsp:include page="../../inc/inc.jsp"></jsp:include>
		<script type="text/javascript">
			$(document).ready(function(){
				$("#user_list").datagrid({ 
			        title:'部门人员', 
			        striped: true, 
			        border: true,
			        collapsible:false,		//是否可折叠的 
			        fit: true,				//自动大小 
			        url:"dept_users", 
			        queryParams:{dept_id:$("#dept_id").val()},
			        idField:'id', 
			        singleSelect:true,//是否单选 
			        pagination:true,//分页控件 
			        rownumbers:true,//行号 
			        remoteSort:false,
			        columns:[[{
						field : 'userName',
						title : '用户名',
						sortable:true,
						halign : 'center',
						width : 120
					},{
						field : 'staffNo',
						title : '员工编号',
						sortable:true,
						halign : 'center',
						width : 120
					},{
						field : 'staffName',
						title : '员工姓名',
						sortable:true,
						halign : 'center',
						width : 150
					},{
						field : 'sex',
						title : '性别',
						sortable:true,
						width : 90,
						halign : 'center',
						formatter : function(value, row, index) {
							switch (value) {
							case "0":
								return '男';
							case "1":
								return '女';
							}
						}
					},{
						field : 'birthDate',
						title : '生日',
						sortable:true,
						halign : 'center',
						width : 150
					},{
						field : 'email',
						title : 'Email',
						sortable:true,
						halign : 'center',
						width : 150
					},{
						field : 'telephone',
						title : '电话',
						sortable:true,
						halign : 'center',
						width : 120
					},{
						field : 'cellphone',
						title : '手机',
						sortable:true,
						halign : 'center',
						width : 120
					},{
						field : 'fax',
						title : '传真',
						sortable:true,
						halign : 'center',
						width : 120
					},{
						field : 'qqChat',
						title : 'QQ',
						sortable:true,
						halign : 'center',
						width : 120
					},{
						field : 'cardNo',
						title : '证件号码',
						sortable:true,
						halign : 'center',
						width : 120
					},{
						field : 'createDate',
						title : '创建时间',
						sortable:true,
						halign : 'center',
						width : 150
					},{
						field : 'lastDate',
						title : '最后登录时间',
						sortable:true,
						halign : 'center',
						width : 150
					},{
						field : 'position',
						title : '职位',
						sortable:true,
						halign : 'center',
						width : 100
					},{
						field : 'remark',
						title : '备注',
						halign : 'center',
						width : 150
					}]],
			        toolbar: '#toolbar'
			    });
			})
		</script>
	</head>
	
	<body>
		<div class="easyui-layout" data-options="fit:true,border:false">
			<!-- 部门信息panel -->
			<div data-options="region:'north',border:false" style="padding:10px 10px;">
				<div id="dept_info" class="easyui-panel" data-options="fit:true" title="部门信息" style="height:160px;width:auto;overflow:hidden;">
					<form id="dept_form" method="post">   
						<input type="hidden" id="dept_id" name="id" value="${dept.id}" />
						<table class="grid">
							<tr>
								<td class="head" width="100">部门名称:</td>
								<td width="120">
									<input class="easyui-textbox" type="text" name="deptName" value="${dept.deptName}" data-options="required:true" />
								</td>
						        <td class="head" width="100">部门类型:</td>
						        <td width="120">
						        	<select name="deptType" class="easyui-combobox" data-options="required:true,width:100,editable:false,panelHeight:'auto'">
										<option value="0" <c:if test="${dept.deptType=='0'}">selected="selected"</c:if>>部门</option>
										<option value="1" <c:if test="${dept.deptType=='1'}">selected="selected"</c:if>>组</option>
									</select>
						        </td>
						        <td class="head" width="100">部门主管:</td>
						        <td width="120">
						        	<input class="easyui-combobox" id="deptManager" name="deptManager" />
						        </td>
						   	</tr>
						    <tr>
						       	<td class="head" width="80">部门描述:</td>
						        <td colspan="5">
						        	<input type="text" name="remark" class="easyui-textbox" data-options="multiline:true,height:40" style="width:300px;" value="${dept.remark}" />
						        </td>
						   	</tr>
						</table>
					</form> 
					<div style="text-align:center;padding-top:2px;">
						<a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:'icon-edit'" onclick="javascript:saveDept();" style="width:90px;">保存</a>
					</div>
				</div> 
			</div>
			
			<!-- 员工列表panel -->
			<div data-options="region:'center',border:false" style="padding:10px;">
				<table id="user_list"></table> 
			</div>
			
			<div id="toolbar" style="display:none">
				<sec:authorize ifAnyGranted='B_ZZGL_UADD'>
					<a onclick="addUser();" href="javascript:void(0);" class="easyui-linkbutton" data-options="plain:true,iconCls:'icon-add'">添加</a>
				</sec:authorize>
				<sec:authorize ifAnyGranted='B_ZZGL_UEDIT'>
					<a onclick="editUser();" href="javascript:void(0);" class="easyui-linkbutton" data-options="plain:true,iconCls:'icon-edit'">修改</a>
				</sec:authorize>
				<sec:authorize ifAnyGranted='B_ZZGL_UDEL'>
					<a onclick="delUser();" href="javascript:void(0);" class="easyui-linkbutton" data-options="plain:true,iconCls:'icon-remove'">删除</a>
				</sec:authorize>
			</div>
			
		</div>
		
		
		<div id="dlg" class="easyui-dialog" style="width:600px;height:auto;padding:10px 20px" buttons="#dlg-buttons" data-options="closed:true,modal:true">
       		<form id="user_form" method="post">
       			<input type="hidden" name="id" />
       			<input type="hidden" name="deptId" />
       			<table class="grid">
       				<tr>
       					<td>用户名</td>
       					<td>
                			<input type="text" id="userName" name="userName" class="easyui-textbox" data-options="required:true,validType:['length[0,20]']" />
       					</td>
       					<td>密码</td>
       					<td>
			 				<input type="text" name="pwdBak" class="easyui-textbox" data-options="required:true" />
       					</td>
       				</tr>
       				<tr>
       					<td>员工姓名</td>
       					<td>
			 				<input type="text" name="staffName" class="easyui-textbox" data-options="required:true" />
       					</td>
       					<td>员工编号</td>
       					<td>
                			<input type="text" name="staffNo" class="easyui-textbox" />
       					</td>
       				</tr>
       				<tr>
       					<td>性别</td>
       					<td>
			 				<select name="sex" class="easyui-combobox" data-options="width:100,editable:false,panelHeight:'auto'">
								<option value="0">男</option>
								<option value="1">女</option>
							</select>
       					</td>
       					<td>生日</td>
       					<td>
			 				<input type="text" name="birthDate" class="easyui-datebox" data-options="editable:false" />
       					</td>
       				</tr>
       				<tr>
       					<td>Email</td>
       					<td>
			 				<input type="text" name="email" class="easyui-textbox" />
       					</td>
       					<td>电话</td>
       					<td>
			 				<input type="text" name="telephone" class="easyui-textbox" />
       					</td>
       				</tr>
       				<tr>
       					<td>手机</td>
       					<td>
			 				<input type="text" name="cellphone" class="easyui-textbox" />
       					</td>
       					<td>传真</td>
       					<td>
			 				<input type="text" name="fax" class="easyui-textbox" />
       					</td>
       				</tr>
       				<tr>
       					<td>职位</td>
       					<td>
			 				<input type="text" name="position" class="easyui-textbox" />
       					</td>
       					<td>QQ</td>
       					<td>
			 				<input type="text" name="qqChat" class="easyui-textbox" />
       					</td>
       				</tr>
       				<tr>
       					<td>证件号码</td>
       					<td>
			 				<input type="text" name="cardNo" class="easyui-textbox" />
       					</td>
       					
       					<td>排序</td>
       					<td>
			 				<input type="text" name="orderNo" class="easyui-numberspinner" data-options="width:100,height:25,max:10000,min:0" />
       					</td>
       				</tr>
       				<tr>
       					<td>状态</td>
       					<td colspan="3">
			 				<select name="status" class="easyui-combobox" data-options="width:100,editable:false,panelHeight:'auto'">
								<option value="0">正常</option>
								<option value="1">停用</option>
							</select>
       					</td>
       					
       				</tr>
       				<tr>
       					<td>备注</td>
       					<td colspan="3">
			 				<input type="text" name="remark" class="easyui-textbox" data-options="multiline:true,height:50,width:300"/>
       					</td>
       				</tr>
       			</table>
				</form>
 			</div>
   		<div id="dlg-buttons">
       		<a href="javascript:void(0)" class="easyui-linkbutton c8" iconCls="icon-ok" onclick="javascript:saveUser();" style="width:90px;">保存</a>
      	 	<a href="javascript:void(0)" class="easyui-linkbutton c2" iconCls="icon-cancel" onclick="javascript:$('#dlg').dialog('close');" style="width:90px;">取消</a>
   		</div>
	</body>
</html>

<script type="text/javascript">
	//修改部门信息
	function saveDept(){
		var data = form2Json("dept_form");
	    if($("#dept_form").form('validate')){
	        $.post('dept_save',{data:data},function(result) {
	            if(result.success){
	                $.messager.show({
	                    title: '提示',
	                    msg: result.msg
	                });
	            }else{
	                $.messager.show({
	                    title: '提示',
	                    msg: result.msg
	                });
	            }
	        },'json');
	    }
	}
	
	
	//================操作部门员工信息================
	function addUser() {
		$('#dlg').dialog('open').dialog('setTitle','新增用户');
		$('#user_form').form('clear');
		$('#userName').textbox('readonly',false);
		$('#user_form').form('load',{
			sex:0,
			status:0,
			orderNo:0
		});
		$("[name='deptId']").val($("#dept_id").val());
	}
	function saveUser(){
		var data = form2Json("user_form");
	    if($("#user_form").form('validate')){
	        $.post('${pageContext.request.contextPath}/sys/user/save_update',{data:data},function(result) {
	            if(result.success){
	            	$('#dlg').dialog('close');
	                $.messager.show({
	                    title: '提示',
	                    msg: result.msg
	                });
	                $('#user_list').datagrid('reload');
	            }else{
	                $.messager.show({
	                    title: '提示',
	                    msg: result.msg
	                });
	            }
	        },'json');
	    }
    }
	function editUser(){
        var row = $('#user_list').datagrid('getSelected');
        if (row){
            $('#dlg').dialog('open').dialog('setTitle','修改用户');
            $('#user_form').form('load',row);
            $('#userName').textbox('readonly',true);
        } else {
        	$.messager.alert('提示','请选择用户','info');
        }
    }
	function delUser(){
		var row = $('#user_list').datagrid('getSelected');
		if (row){
			if(row.user_name == 'admin'){
				$.messager.alert('提示','admin账号不能删除!');
			} else {
				$.messager.confirm('提示','请确认是否删除?',function(r){
					if (r){
						$.ajax({
							url:'${pageContext.request.contextPath}/sys/user/delete',
							type:'POST',
							data:{id:row.id,name:row.userName},
							dataType:'json',
							success: function(result){
								if(result.success){
									$.messager.show({
										title: '提示',
										msg: result.msg
									});
									$('#user_list').datagrid('reload');
									$('#user_list').datagrid('clearSelections');
								} else {
									$.messager.show({
										title: '提示',
										msg: result.msg
									});
								}
							}
						});
					}
				});
			}
		} else {
            $.messager.alert('提示','请选择用户','info');
        }
	}
	
</script>